<template>
   <div>
     <h1>123</h1>
   </div>
</template>

<script>
export default {
  data() {
    return {
      searchKeyword: '',
      products: [], // 假设这是从服务器获取的商品列表数据
      user: {
        account: 'zhangsan', // 示例用户信息
        avatar: 'path/to/user/avatar.png',
      },
    };
  },
  computed: {
    // 过滤商品列表，根据名称搜索
    filteredProducts() {
      return this.products.filter(product =>
          product.name.includes(this.searchKeyword)
      );
    },
  },
  methods: {
    onSearch() {
      // 搜索逻辑，这里直接使用了计算属性进行过滤
    },
    logout() {
      // 退出登录的逻辑，清除token，重定向到登录页等
      localStorage.removeItem('token');
      this.$router.push('/login');
    },
  },
  created() {
    // 这里应该从服务器获取商品列表数据
    // 示例数据初始化
    this.products = [
      { id: 1, name: '这是一个很长很长的商品名称示例超过15个字符...', publisherInfo: '出版社A' },
      // 更多商品数据...
    ];
  },
};
</script>

<style scoped>
.header-left {
  margin-right: auto;
}

.header-right {
  display: flex;
  align-items: center;
}
</style>
